<div #all
     [style.background-image]="'url(' + (goldObj? IPPORT + goldObj.goldBG : data.fillData.fillImg) + ')'"
     [style.background-position]="goldObj?'bottom center':'auto'"
     [style.background-size]="goldObj?'100% 100%':'auto'"
>
    <div #top class="guess-top">
        <div>
            <p class="title"> 因果推想 </p>
            <p class="fillcontent">标题：{{data.fillData.title || '请输入标题'}}</p>
            <p class="fillcontent">关键字：
                <span *ngFor="let keys of data.fillData.key;let i = index">{{ keys || "请输入关键字"}}
                    <span *ngIf="i != data.fillData.key.length-1">、</span>
                </span>
            </p>
            <p class="tec-anwser" *ngIf="showAnwser">答案：{{data.fillData.anwser || '请输入答案'}}</p>
        </div>
    </div>
    <div class="guess-pop" *ngIf="data.text">
        <span (click)="closePop()">×</span>
        <table border="0" cellpadding="0" cellspacing="0">
            <tr>
                <td align="right" style="height: 50px;width: 180px">编辑标题：</td>
                <td>
                    <nz-input #color style="width: 80%;margin-left:10px" [nzType]="'text'"
                              [(ngModel)]="data.fillData.title" appMargin [bottom]="5" [nzRows]="'4'"
                              name="color1"></nz-input>
                </td>
            </tr>
            <tr>
                <td align="right" style="height: 50px;margin-left:10px">正确答案：</td>
                <td>
                    <nz-input #color style="width: 80%;" [nzType]="'text'" [(ngModel)]="data.fillData.anwser" appMargin
                              [bottom]="5" [nzRows]="'4'" name="color1"></nz-input>
                </td>
            </tr>
            <tr>
                <td align="right" style="vertical-align: top;padding-top:7px;height: 220px;">编辑关键词：</td>
                <td style="vertical-align: top">
                    <ul>
                        <li *ngFor="let key of data.fillData.key,let i = index">
                            <div style="float: left;margin-left:0">
                                {{i+1}}.{{ key }}
                            </div>
                            <div>
                                <i [class]="i === 0 ?  'anticon anticon-caret-up top_one nothover' : 'anticon anticon-caret-up top_one'"
                                   (click)="top_one(i)"></i>
                                <i [class]="i === data.fillData.key.length-1 ?  'anticon anticon-caret-down down_one nothover' : 'anticon anticon-caret-down down_one'"
                                   (click)="down_one(i)"></i>
                            </div>
                            <div>
                                <i [class]="i === 0 ?  'anticon anticon-step-forward to_top nothover' : 'anticon anticon-step-forward to_top'"
                                   (click)="to_top(i)"></i>
                            </div>
                            <div>
                                <i [class]="i === data.fillData.key.length-1 ?  'anticon anticon-step-backward to_down nothover' : 'anticon anticon-step-backward to_down'"
                                   (click)="to_down(i)"></i>
                            </div>
                            <div>
                                <i class="anticon anticon-close remove_one" (click)="remove_one(i)"></i>
                            </div>
                        </li>
                        <li style="text-align: left;border-bottom: 0">
                            <nz-input #color style="width: 80%;" [nzType]="'text'" [(ngModel)]="key" appMargin
                                      [bottom]="5" [nzRows]="'4'" name="color1"></nz-input>
                            <button style="margin-left:10px;" nz-button [nzType]="'primary'" (click)="saveKey()">添加
                            </button>
                        </li>
                    </ul>
                </td>
            </tr>
            <tr>
                <td></td>
                <td align="right">
                    <button style="margin-right:20%;" nz-button [nzType]="'primary'" (click)="closePop()">确定</button>
                </td>
            </tr>
        </table>
    </div>

    <div #center class="guess-center" [ngClass]="{'gold': goldObj}" [style.height.px]="centerHeight">
        <ul #answerListBox style="padding-bottom: 100px;">
            <!--<li *ngFor="let data of answerList; let i = index">-->
            <!--<div *ngIf="i%2 ===0 " class="user">-->
            <!--<img [src]="data.imagePath?IPPORT + data.imagePath : './assets/img/defaultUser-img.jpg'">-->
            <!--<span>-->
            <!--{{data.userName}}-->
            <!--</span>-->
            <!--<span style="font-size: 14px">-->
            <!--{{data.role_name}}-->
            <!--</span>-->
            <!--</div>-->
            <!--<div class="answer"-->
            <!--[ngClass]="{'yon_bgcolor_yes': data.g_yon == 1,'yon_bgcolor_no': data.g_yon == 2 ,'yon_bgcolor_wg': data.g_yon == 3}">-->
            <!--<p>{{data.answer}}</p>-->
            <!--</div>-->
            <!--<div *ngIf="i%2 !==0 " class="user">-->
            <!--<img [src]="data.imagePath?IPPORT + data.imagePath : './assets/img/defaultUser-img.jpg'">-->
            <!--<span>-->
            <!--{{data.userName}}-->
            <!--</span>-->
            <!--<span style="font-size: 14px">-->
            <!--{{data.role_name}}-->
            <!--</span>-->
            <!--</div>-->
            <!--</li>-->
        </ul>

    </div>
</div>
